import {
  createRouter,
  createWebHistory,
  type Router,
  // type RouteRecordRaw,
  type RouteComponent
} from 'vue-router'

// TODO: 为什么 按需导入中 无法使用 @
const routes = [
  // 首页
  {
    path: '/',
    name: 'home',
    meta: {
      title: '首页'
    },
    component: (): RouteComponent => import('../views/Home.vue')
  },
  // 新闻列表
  {
    path: '/list',
    name: 'list',
    meta: {
      title: '新闻列表'
    },
    component: (): RouteComponent => import('../views/List.vue')
  },
  // 设置页
  {
    path: '/setting',
    name: 'setting',
    meta: {
      title: '全局设置'
    },
    component: (): RouteComponent => import('../views/Setting.vue')
  },
  // 404
  {
    path: '/404',
    name: '404',
    meta: {
      title: '404'
    },
    component: (): RouteComponent => import('../views/404.vue')
  },
  {
    path: '/:pathMatch(.*)',
    redirect: '/404'
  }
]

const router: Router = createRouter({
  // history: createWebHistory(import.meta.env.BASE_URL),
  history: createWebHistory(),
  routes
})

// 路由守卫
// 添加加载线
router.beforeEach(() => {
  window.$LoadingBar.start()
})

router.afterEach(() => {
  window.$LoadingBar.finish()
})

export default router
